// Vue.util.defineReactive(this, 'current', '/);

function defineReactive(obj, key, val) {
    observe(val);

    Object.defineProperty(obj, key, {
        get() {
            console.log('get', key);
            return val;
        },
        set(newValue) {
            if (newValue !== val) {
                console.log('set', key);
                val = newValue;
            }
        }
    })
}

// 遍历传入对象的所有属性，执行响应式处理
function observe(obj) {
    if (typeof obj !== 'object' || obj == null) {
        return obj;
    }
    Object.keys(obj).forEach( key => defineReactive(obj, key, obj[key]))
}

// 响应式对象追加新属性
// Vue.set(obj, key, val);
function set(obj, key, val) {
    observe(val);
    defineReactive(obj, key, val);
}

let obj = {
    foo: 'foo',
    bar: 'bar',
    baz: {
        a:1
    }
};

observe(obj);
set(obj, 'dong', 'dong');
obj.dong;

// defineProperty 解决不了数组的响应式：
// 数组的解决方案是：要拦截数组的7个变更方法，然后覆盖它们，让它们做数组操作的同时，进行变更通知